home *** CD-ROM | disk | FTP | other *** search
/ Dynamic HTML Construction Kit / Dynamic HTML Construction Kit.iso / source_code / dhtmlunl / dhtml.exe / CD Content / Chap23 / dun23_4.txt < prev    next >
Encoding:
Text File  |  1997-12-18  |  1.7 KB  |  55 lines
  1. <html>
  2.  
  3. <head>
  4.  
  5. <title>In the Yard</title>
  6.  
  7. </head>
  8.  
  9. <body bgcolor="white">
  10.  
  11. <script language="Javascript1.2">
  12.  
  13. <!--//
  14.  
  15.  
  16.  
  17. function walkDog(d) {
  18.  
  19.    var dl = document.layers['puppy'];
  20.  
  21.    if ((dl.left == 270) || (dl.left == 200)) {
  22.  
  23.       if (d == 1) {
  24.  
  25.          dl.moveBelow(document.layers['tree']);
  26.  
  27.       } else {
  28.  
  29.          dl.moveAbove(document.layers['tree']);
  30.  
  31.       }
  32.  
  33.       if (dl.left == 200) {
  34.  
  35.          slideTo(dl, 70, 270);
  36.  
  37.       } else if (dl.left == 270) {
  38.  
  39.          slideTo(dl, 70, 200);
  40.  
  41.       }
  42.  
  43.    }
  44.  
  45. }
  46.  
  47.  
  48.  
  49. function slideTo(targetLayer, targetTop, targetLeft) {
  50.  
  51.    if((targetLayer.top != targetTop) || (targetLayer.left != targetLeft)) {
  52.  
  53.       if (targetLayer.top < targetTop) targetLayer.top = targetLayer.top  + 1;
  54.  
  55.       if (targetLayer.top > targetTop) targetLayer.top = targetLayer.top  - 1;
  56.  
  57.       if (targetLayer.left < targetLeft) targetLayer.left = targetLayer.left  + 1;
  58.  
  59.       if (targetLayer.left > targetLeft) targetLayer.left = targetLayer.left  - 1;
  60.  
  61.       setTimeout('slideTo(document.layers["'+targetLayer.name+'"],'+targetTop+','+targetLeft+')',1);
  62.  
  63.    }
  64.  
  65. }
  66.  
  67. //-->
  68.  
  69. </script>
  70.  
  71. <body bgcolor="white">
  72.  
  73.  
  74.  
  75. <layer z-index=2 id="grass" background="grass.gif" height=200 width=200 top=0 left=150></layer>
  76.  
  77.  
  78.  
  79. <layer z-index=4 id="tree" background="tree.gif" height=124 width=20 top=10 left=250></layer>
  80.  
  81.  
  82.  
  83. <layer z-index=3 id="puppy" height=50 width=50 top=70 left=200>
  84.  
  85. <img src="puppy.gif" border=0 height=50 width=50>
  86.  
  87. </layer>
  88.  
  89.  
  90.  
  91. <layer name="commands" top=120 left=0>
  92.  
  93. <form>
  94.  
  95. <input type="button" value="Go Around" width=100 onClick="walkDog(0)"><br>
  96.  
  97. <input type="button" value="Go Behind" width=100 onClick="walkDog(1)">
  98.  
  99. </form>
  100.  
  101. </layer>
  102.  
  103.  
  104.  
  105. </body>
  106.  
  107. </html>
  108.  
  109.